<template>
	<view class="text-2xl" @click="openLanguageSelect">
		{{$t('index.home')}}
		当前语言：{{ currentSelectLanguage }}
	</view>
	<uv-picker ref="languagePicker" :columns="languages" @confirm="languageSelectConfirm"></uv-picker>
	<uv-modal ref="resetAppModal" :title="$t('text.prompt')" content='重启App生效,是否重启？' showCancelButton @confirm="resetAppConfirm"></uv-modal>
</template>

<script setup>
	
	const languagePicker = ref(null)
	const languages = [['简体中文', 'English']]
	const languagesValue = ['zh-Hans', 'en']
	const currentSelectLanguage = ref('zh-Hans')
	const cacheSelectLanguage = ref('')
	
	//重启app弹框标记
	const resetAppModal = ref(null)
	
	onMounted(()=>{
		let localeName = uni.getLocale()
		currentSelectLanguage.value = getLanguageCNName(localeName)
	})
	
	//打开弹框
	const openLanguageSelect = () => {
		languagePicker.value.open()
	}
	
	//选择
	const languageSelectConfirm = (e) => {
		console.log('confirm', e);
		let languageValue = languagesValue[e.indexs[0]]
		if(languageValue){
			cacheSelectLanguage.value = languageValue
			// #ifdef H5
			currentSelectLanguage.value = getLanguageCNName(cacheSelectLanguage.value)
			uni.setLocale(languageValue)
			window.location.reload()
			// #endif
			// #ifdef APP-PLUS
			resetAppModal.value.open()
			// #endif
		}
	}
	
	//获取语言
	const getLanguageCNName = (localeName) => {
		let languagesValueIndex = languagesValue.indexOf(localeName)
		console.log(languagesValueIndex)
		return languages[0][languagesValueIndex]
	}
	
	//重启App
	const resetAppConfirm = () => {
		switch (uni.getSystemInfoSync().platform) {
			case 'android':
				console.log('运行Android上重启App');
				currentSelectLanguage.value = getLanguageCNName(cacheSelectLanguage.value)
				uni.setLocale(cacheSelectLanguage.value)
				plus.runtime.restart();
				break;
			case 'ios':
				console.log('运行iOS上重启App');
				currentSelectLanguage.value = getLanguageCNName(cacheSelectLanguage.value)
				uni.setLocale(cacheSelectLanguage.value)
				plus.runtime.restart();
				break;
			default:
				console.log('运行在开发者工具上重启App');
				break;
		}
	}
</script>

<style scoped>

</style>
